<template>
     <!-- 百度地图  -->
  <div id="bai-du-map" style="height:100%">
    <!-- 技术支持和联系方式  -->
    
  </div>
</template>
<script>
import AMapLoader from "@amap/amap-jsapi-loader";
// 设置安全密钥

window._AMapSecurityConfig = {
    securityJsCode: '24d3aeca2296f5ba1b941e3ee2db4bde',
}
export default {
    data() {
        return {
            map : null,
            mouseTool : null,
            overlays : [],
            auto : null,
            placeSearch : null
        }
    },
    created(){
        this.initMap();
    },
    mounted(){
       
    },
    methods : {
        initMap() {
            let that=this;
            AMapLoader.load({
                "key": "9cc47c004176d9ca9a8c11741899a05f", 
                "version": "2.0",   // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
                "plugins": ["AMap.AutoComplete", "AMap.PlaceSearch", "AMap.Driving", "AMap.DragRoute"],         // 需要使用的的插件列表，如比例尺'AMap.Scale'等
            }).then((AMap)=>{
                // 初始化地图
                this.map = new AMap.Map('bai-du-map',{
                    viewMode : "2D",  //  是否为3D地图模式
                    zoom : 13,   // 初始化地图级别
                    center : [113.65553,34.748764], //中心点坐标  郑州
                    resizeEnable: true
                });
                let that=this;
                AMap.plugin('AMap.Driving', function() {
                    const driving = new AMap.Driving({
                        map: that.map,
                        
                        // 驾车路线规划策略，AMap.DrivingPolicy.LEAST_TIME是最快捷模式
                        // eslint-disable-next-line no-undef
                        policy: AMap.DrivingPolicy.LEAST_TIME
                    })
                    const points = [
                        { keyword: "东部软件城", city: '杭州市' },
                        { keyword: "擎天半岛", city: '杭州市' }
                    ]
                    var startLngLat = [113.65553,34.748764]
                    var endLngLat = [116.427281, 39.903719]
                    
                    driving.search(startLngLat, endLngLat, function (status, result) {
                        // 未出错时，result即是对应的路线规划方案
                    })
                });
                
                /*
                driving.search(points, (status, result) => {
                    // 未出错时，result即是对应的路线规划方案
                    console.log('status=', status)
                    console.log('result=', result)
                })*/
               
            }).catch(e => {
                console.log(e);
            });
        }
    }
}
</script>